﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="sumchart.aspx.cs" Inherits="HealthSystem.ReportPage.sumchart" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="http://localhost:12280/Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script src="http://localhost:12280/Scripts/highcharts.js" type="text/javascript"></script>
    <script src="http://localhost:12280/Scripts/exporting.js" type="text/javascript"></script>
    <script type="text/javascript">
        var chart;
        var ser = {};
        $(document).ready(function () {
            $.getJSON("ChartHandler.ashx?saction=sumchar", {}, function (data) {
                ser = data.series;
                chart = new Highcharts.Chart({
                    chart: {
                        renderTo: 'container',
                        type: 'line',
                        marginRight: 130,
                        marginBottom: 25
                    },
                    title: {
                        text: '人数统计',
                        x: -20 //center
                    },
                    subtitle: {
                        text: '广东省',
                        x: -20
                    },
                    xAxis: data.categories,
                    yAxis: {
                        title: {
                            text: '学生数量'
                        },
                        plotLines: [{
                            value: 0,
                            width: 1,
                            color: '#808080'
                        }]
                    },
                    tooltip: {
                        formatter: function () {
                            return '<b>' + this.series.name + '</b><br/>' +
                        this.x + ': ' + this.y+'位学生';
                        }
                    },
                    legend: {
                        layout: 'vertical',
                        align: 'right',
                        verticalAlign: 'top',
                        x: -10,
                        y: 100,
                        borderWidth: 0
                    },
                    series: ser
                });
            });

        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    </form>
</body>
</html>
